<template>
	<div class="media">
		<el-upload
		  action="http://v21-adm.ifire.mobi/obs"
		  list-type="picture-card"
		  :limit="1"
		  :on-preview="handlePictureCardPreview"
		  :on-success="handleSuccess"
		  :on-remove="handleRemove">
			<i class="el-icon-plus"></i>
		</el-upload>
		<el-dialog :visible.sync="dialogVisible">
		  <img width="100%" :src="img" alt="">
		</el-dialog>
	</div>
</template>
<script>
  export default {
  	props: {
	    img: {
	      twoWay: true,
	      required: true
	    },
	    type:{
	      type: String,
	      default: "img"
	    }
	  },
    data() {
      return {
        dialogVisible: false
      }
    },
    methods: {
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePictureCardPreview(file) {
        this.dialogVisible = true;
      },
      handleSuccess(res){
      	this.img = res.url;
      	this.$emit('update:img', res.url)
      }
    },
    mounted(){
    	// this.fileList.push(this.img)
    }
  }
</script>
<style scoped>
	.media{
		width: 150px;
		height: 150px;
		overflow: hidden;
	}
	div.el-upload.el-upload--picture-card{
		width: 146px;
		height: 146px;
		line-height: 156px;
	}
</style>
